<template>
  <div class="mainDiv">
    <mt-cell class="" title="可选择的范围有："></mt-cell>
    <div class="flex-center">
      <div>学校:<b class="ml10">{{total.totalSchool}}所</b></div>
      <div>专业:<b class="ml10">{{total.totalMajor}}个</b></div>
      <div>招生计划:<b class="ml10">{{total.totalPeople}}个</b></div>
    </div>
    <div class="line"></div>
    <mt-cell class="border-bot" title="请选择你喜欢的专业："></mt-cell>
    <mt-checklist class="myRadio"  v-if="bachelors.length"  title="本科"  v-model="bachelor"  :options="bachelors"></mt-checklist>
    <mt-checklist class="myRadio"  v-if="juniors.length"    title="专科"  v-model="junior"    :options="juniors"></mt-checklist>
    <div class="padlr10">
      <mt-button size="large" type="primary" @click="chooseMajor">下一步</mt-button>
    </div>
  </div>
</template>

<script>
    export default {
        name: "major",
        data() {
        return {
          search:{},
          bachelor:[],
          junior:[],
          userInfo:{},
          bachelors:[],
          juniors:[],
          total:{totalPeople:1,totalMajor:1,totalSchool:1}
        }
      },
      watch:{bachelor:{
          handler(newVal,oldVal){
            if(newVal.length){
              this.junior = [];
            }
          },
          deep:true},
        junior:{
          handler(newVal,oldVal){
            if(newVal.length){
              this.bachelor = [];
            }
          },
          deep:true},
      },
      methods:{
        chooseMajor:function(){
          if(this.bachelor && this.bachelor.length){
            this.search.level = "本科";
            this.search.majors = this.bachelor;
          }else if(this.junior && this.junior.length){
            this.search.level = "专科";
            this.search.majors = this.junior;
          }
          this.$router.push({path:"/student/intention", query:this.search});
        }
      },
      created(){
        let vm = this;
      },
      beforeMount(){
        console.log(this.$route.query.batch);
        let vm = this;
        Object.assign(vm.search, this.$route.query);
        //vm.search = JSON.parse(JSON.stringify(this.$route.query));
        vm.search.year = vm.$root.year;
        vm.$http.post("/auth/gradeRet",changeDataType(vm.search)).then(resp=>{
          vm.total = resp.data;
        })
        vm.$http.post("/auth/largeClass",changeDataType(vm.search)).then(resp=>{
          resp.data.forEach(n=>{
            if(n.largeClassList && n.largeClassList.length){
              let options = n.largeClassList.filter(n=>n.trim()!="")
              switch (n.level) {
                case '本科':vm.bachelors = options ;break;
                case '专科':vm.juniors =options; break;
              }
            }
          })
        })
      }
    }
</script>

<style >
 .mainDiv .flex-center{
   height: 40px;
   line-height: 40px;
   margin: 0 10px;
   display: flex;
   justify-content: space-between;
 }
 .flex-center b{
   color: #058CF2;
 }
 .myRadio{
   margin-top: 20px!important;
 }
 .myRadio .mint-checklist-title{
   font-size: 16px;
   margin-left: 10px;
 }
</style>
